<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="layui/css/layui.css" media="all" rel="stylesheet">
    <script src="layui/layui.js" type="text/javascript"></script>
    <script src="js/jquery-3.3.1.min.js" type="text/javascript"></script>
</head>
<body>
<br/>
<br/>
<h1 style="text-align: center;">学生-考试管理</h1>
<div class="layui-container"
     style="width: 500px;height: 330px;margin-top: 80px;border: 1px solid #009688;padding-top: 60px;border-radius: 15px">

    <form action="" class="layui-form" method="post">
        <div class="layui-form-item" style="margin-left: 50px;">
            <label class="layui-form-label">用户名</label>
            <div class="layui-inline">
                <input autocomplete="off" class="layui-input" lay-verify="username" name="username" placeholder="请输入用户名"
                       type="text">
            </div>
        </div>
        <div class="layui-form-item" style="margin-left: 50px;">
            <label class="layui-form-label">密码</label>
            <div class="layui-inline">
                <input autocomplete="off" class="layui-input" lay-verify="password" name="password" placeholder="请输入密码"
                       type="password">
            </div>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn" lay-filter="login" lay-submit style="margin-left: 200px;">登陆</button>
        </div>
    </form>
</div>
<script charset="utf-8" src="layui/layui.js"></script>
<script>
    layui.use(['form'], function () {
        var form = layui.form;

        //自定义验证规则
        form.verify({
            username: function (value) {
                if (value.length == 0) {
                    return '用户名不能为空';
                }
            }
            , password: [/(.+){6,12}$/, '密码必须6到12位']
        });
        form.on('submit(login)', function (data) {
            //向后台发送数据，验证登录信息
            $.ajax({
                url: '/account/login/student/' + data.field.username + '/' + data.field.password, //请求url
                data: '', //请求参数，类似于username=xxx&password=xxx
                type: 'get', //请求方式
                dataType: 'json', //返回值的类型
                success: function (result) {  //服务器成功返回时执行的函数
                    console.log(JSON.stringify(result));
                    if (result.code == 2000) {
                        alert("登录成功！");
                        sessionStorage.setItem("studentId", result.studentId);
                        sessionStorage.setItem("studentName", result.studentName);
                        sessionStorage.setItem("studentUsername", result.studentUsername);
                        window.location.href = "/student-main.html";
                    } else {
                        alert("用户名或密码输入有误");
                    }
                }
            });
            return false;
        });
    });

</script>
</body>
</html>